<%--
  Created by IntelliJ IDEA.
  User: CZC70
  Date: 2016/9/18
  Time: 11:08
  To change this template use File | Settings | File Templates.
--%>
<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<html>
<head>
    <title>Title</title>
    <script type="text/javascript" src="<%=request.getContextPath()%>/resources/js/jquery.min.js"></script>
</head>
<body>
<form id="upload_form"  onsubmit="return uploadFile();" method="POST" enctype="multipart/form-data">
    username: <input type="text" name="username"/><br/>
    nickname: <input type="text" name="nickname"/><br/>
    password: <input type="password" name="password"/><br/>
    yourmail: <input type="text" name="email"/><br/>
    yourfile: <input type="file" name="myfiles"/><br/>
    yourfile: <input type="file" name="myfiles"/><br/>
    yourfile: <input type="file" name="myfiles"/><br/>
    <input type="submit" value="添加新用户"/>
</form>

<script type="text/javascript" >
    function uploadFile(){
        $.ajax({ url: "<%=request.getContextPath()%>/add",
            type: 'POST',
            enctype: "multipart/form-data",
            xhr: function() {  // custom xhr
                myXhr = $.ajaxSettings.xhr();
                if(myXhr.upload){ // if upload property exists
//                    myXhr.upload.addEventListener('progress', progressHandlingFunction, false); // progressbar
                }
                return myXhr;
            },
            data: $("#upload_form").serialize(),
            success: function(data){
                alert(data);
            }
        })
    }

</script>
</body>
</html>
